<template>
  <div class="page_index index_banner" :style="{ backgroundImage: 'url(' + indexbg + ')' }">
      <div style="padding-top: 200px;padding-bottom: 100px">
          <div style="font-size: 40px;color:#fff;font-weight: 800">
              开启AI应用开发新时代
          </div>
          <div style="font-size: 20px;color:#f4f5f6;margin-top:50px;font-weight: 600">
              含光AI大模型覆盖智慧问答工作全流程，大幅提升工作效能
          </div>
          <div style="margin-top:50px">
              <el-button type="primary" size="large" round
                  @click="() => { this.$router.push('/kdbList') }">进入知识库</el-button>
              <el-button type="success" size="large" plain round
                  @click="() => { this.$router.push('/aisearchIndex') }">体验AI搜索</el-button>
          </div>
      </div>
  </div>
  <div style="background-color: #fff;padding:100px 20px">
      <div style="text-align: center">
          <h1>只需4步，轻松得到你的答案</h1>
          <div style="padding:50px 20px">
              <label>全链路AI搜索赋能引擎，含光AI技术赋能多场景</label>
          </div>
      </div>
      <el-row :gutter="8">
          <el-col :span="6" :xs="24" :sm="12" :md="6" :lg="6" :xl="6">
              <el-card shadow="hover" style="margin:2px">
                  <div><img src="../assets/createqn.png" style="width: 60px;" /></div>
                  <div>
                      <h3>上传知识文档</h3>
                  </div>
                  <div>全格式解析，支持文中文嵌套</div>
              </el-card>
          </el-col>
          <el-col :span="6" :xs="24" :sm="12" :md="6" :lg="6" :xl="6">
              <el-card shadow="hover" style="margin:2px">
                  <div><img src="../assets/publishqn.png" style="width: 60px;" /></div>
                  <div>
                      <h3>训练知识库</h3>
                  </div>
                  <div>快速构建知识向量，服务相似度搜索</div>
              </el-card>
          </el-col>
          <el-col :span="6" :xs="24" :sm="12" :md="6" :lg="6" :xl="6">
              <el-card shadow="hover" style="margin:2px">
                  <div><img src="../assets/doqn.png" style="width: 60px;" /></div>
                  <div>
                      <h3>互联网实时搜索</h3>
                  </div>
                  <div>支持多搜索引擎互联网实时搜索聚合</div>
              </el-card>
          </el-col>
          <el-col :span="6" :xs="24" :sm="12" :md="6" :lg="6" :xl="6">
              <el-card shadow="hover" style="margin:2px">
                  <div><img src="../assets/anaqn.png" style="width: 60px;" /></div>
                  <div>
                      <h3>思维链引导的搜索能力</h3>
                  </div>
                  <div>含光AI自研Search Cot技术，重塑智慧搜索</div>
              </el-card>
          </el-col>
      </el-row>
  </div>


  <div class="create_wj index_banner" style="background-color: #050505;">
      <div style="padding: 100px 0px; ">
          <div style="font-size:40px;color:#fff">
              让含光AI融入你的工作与生活
          </div>
      </div>
  </div>

</template>
<script>
import indexbg from '../assets/bg.jpg'
import footerbg from '../assets/footerbg.png'
export default {
  data() {
      return {
          screenheight: document.documentElement.clientHeight/3 + 'px',
          indexbg: indexbg,
          footerbg: footerbg,
          activeRole: '教育局'
      }
  },
  mounted() {
      window.onresize = () => {
          return (() => {
              this.screenheight = document.documentElement.clientHeight/3 + 'px'
          })
      }
  }
}
</script>
<style>
.page_index {
  background-color: transparent;
  background-position: center;
  background-size: cover;
  position: relative;
  width: 100%;
  text-align: center;
  min-height: 100%;
}
.el-carousel{
  width: 100%
}
.index_banner {
  background: rgba(0, 82, 217, 0.01);
  -webkit-backdrop-filter: blur(6px);
  backdrop-filter: blur(6px);
  text-align: center;
}

.create_wj {
  background-image: url(footerbg);
  background-size: cover;
  background-position: center;
  width: 100%;
  padding: 100px auto;
}
</style>